/******************************************************************************************
 * Import
 ******************************************************************************************/

// module
import { Dimensions } from 'react-native';

/******************************************************************************************
 * Variable
 ******************************************************************************************/

// 宽度、rpx与px换算关系
const screenWidth = Dimensions.get('window').width;
const pxTransform = screenWidth / 750;

/******************************************************************************************
 * Export Class
 ******************************************************************************************/

export default class Style {

    /***************************************************************
     * Position系列
     **************************************************************/

    // absolute
    static abs() {
        return { 
            position: 'absolute' 
        };
    }

    // relative
    static rel() {
        return { 
            position: 'relative' 
        };
    }

    /***************************************************************
     * 定位位置系列
     **************************************************************/

    // zindex
    static zindex(zIndex) {
        return { 
           zIndex: parseInt(zIndex)
        };
    }

    // （转换）top
    static top(size) {
        size = this._transform(size);
        return { 
            top: size
        };
    }

    // （转换）bottom
    static bottom(size) {
        size = this._transform(size);
        return { 
            bottom: size
        };
    }

    // （转换）left
    static left(size) {
        size = this._transform(size);
        return { 
            left: size
        };
    }

    // （转换）right
    static right(size) {
        size = this._transform(size);
        return { 
            right: size
        };
    }

    /***************************************************************
     * 宽、高、行高、背景、对齐、透明度
     **************************************************************/

    // flex
    static f(flex) {
        return { 
            flex: parseFloat(flex)
        };
    }

    // （转换）宽
    static w(size) {
        size = this._transform(size);
        return { 
            width: size
        };
    }

    // （转换）高
    static h(size) {
        size = this._transform(size);
        return { 
            height: size
        };
    }

    // （转换）行高
    static lh(size) {
        size = this._transform(size);
        return { 
            lineHeight: size
        };
    }

    // 背景
    static bg(bg) {
        return { 
            backgroundColor: bg 
        };
    }

    // 透明度
    static opacity(opacity) {
        return { 
            opacity: parseFloat(opacity)
        };
    }

    /***************************************************************
     * 外边距系列
     **************************************************************/

    // （转换）全部
    static ma(size) {
        
        // 根据是否存在空格，确定是否分开x, y值
        if (size.indexOf(' ') != -1) {
            const temp = size.split(' ');
            size = {
                y: this._transform(temp[0]),
                x: this._transform(temp[1])
            };
        } else {
            size = this._transform(size);
            size = {
                y: size,
                x: size
            };
        }

        // 返回
        return { 
            marginTop: size.y,
            marginBottom: size.y,
            marginLeft: size.x,
            marginRight: size.x
        };
    }

    // （转换）上
    static mt(size) {
        size = this._transform(size);
        return { 
            marginTop: size
        };
    }

    // （转换）下
    static mb(size) {
        size = this._transform(size);
        return { 
            marginBottom: size
        };
    }

    // （转换）左
    static ml(size) {
        size = this._transform(size);
        return { 
            marginLeft: size
        };
    }

    // （转换）右
    static mr(size) {
        size = this._transform(size);
        return { 
            marginRight: size
        };
    }

    // （转换）左右
    static mx(size) {
        size = this._transform(size);
        return {
            marginLeft: size,
            marginRight: size
        };
    }

    // （转换）上下
    static my(size) {
        size = this._transform(size);
        return {
            marginTop: size,
            marginBottom: size
        };
    }

    /***************************************************************
     * 内边距系列
     **************************************************************/

    // （转换）全
    static pa(size) {

        // 根据是否存在空格，确定是否分开x, y值
        if (size.indexOf(' ') != -1) {
            const temp = size.split(' ');
            size = {
                y: this._transform(temp[0]),
                x: this._transform(temp[1])
            };
        } else {
            size = this._transform(size);
            size = {
                y: size,
                x: size
            };
        }

        // 返回
        return { 
            paddingTop: size.y,
            paddingBottom: size.y,
            paddingLeft: size.x,
            paddingRight: size.x
        };
    }

    // （转换）上
    static pt(size) {
        size = this._transform(size);
        return { 
            paddingTop: size
        };
    }

    // （转换）下
    static pb(size) {
        size = this._transform(size);
        return { 
            paddingBottom: size
        };
    }

    // （转换）左
    static pl(size) {
        size = this._transform(size);
        return { 
            paddingLeft: size
        };
    }

    // （转换）右
    static pr(size) {
        size = this._transform(size);
        return { 
            paddingRight: size
        };
    }

    // （转换）左右
    static px(size) {
        size = this._transform(size);
        return {
            paddingLeft: size,
            paddingRight: size
        };
    }

    // （转换）上下
    static py(size) {
        size = this._transform(size);
        return {
            paddingTop: size,
            paddingBottom: size
        };
    }

    /***************************************************************
     * 边框系列
     **************************************************************/

    // 全部
    static ba(border) {
        let res = this._getBorder(border);
        return {
            borderStyle: res.style,
            borderColor: res.color,
            borderWidth: res.width
        };
    }

    // 上
    static bt(border) {
        let res = this._getBorder(border);
        return {
            borderStyle: res.style,
            borderTopColor: res.color,
            borderTopWidth: res.width
        };
    }

    // 下
    static bb(border) {
        let res = this._getBorder(border);
        return {
            borderStyle: res.style,
            borderBottomColor: res.color,
            borderBottomWidth: res.width
        };
    }

    // 左
    static bl(border) {
        let res = this._getBorder(border);
        return {
            borderStyle: res.style,
            borderLeftColor: res.color,
            borderLeftWidth: res.width
        };
    }

    // 右
    static br(border) {
        let res = this._getBorder(border);
        return {
            borderStyle: res.style,
            borderRightColor: res.color,
            borderRightWidth: res.width
        };
    }

    // 左右
    static bx(border) {
        let res = this._getBorder(border);
        return {
            borderStyle: res.style,
            borderLeftColor: res.color,
            borderLeftWidth: res.width,
            borderRightColor: res.color,
            borderRightWidth: res.width
        };
    }

    // 下下
    static by(border) {
        let res = this._getBorder(border);
        return {
            borderStyle: res.style,
            borderTopColor: res.color,
            borderTopWidth: res.width,
            borderBottomColor: res.color,
            borderBottomWidth: res.width
        };
    }

    /***************************************************************
     * 圆角系列
     **************************************************************/

    // （转换）全
    static ra(size) {
        size = this._transform(size);
        return {
            borderRadius: size
        };
    }

    // （转换）上
    static rt(size) {
        size = this._transform(size);
        return {
            borderTopLeftRadius: size,
            borderTopRightRadius: size
        };
    }

    // （转换）下
    static rb(size) {
        size = this._transform(size);
        return {
            borderBottomLeftRadius: size,
            borderBottomRightRadius: size
        };
    }

    // （转换）左
    static rl(size) {
        size = this._transform(size);
        return {
            borderTopLeftRadius: size,
            borderBottomLeftRadius: size
        };
    }

    // （转换）右
    static rr(size) {
        size = this._transform(size);
        return {
            borderTopRightRadius: size,
            borderBottomRightRadius: size
        };
    }

    /***************************************************************
     * 文字系列
     **************************************************************/

    // 颜色
    static color(color) {
        return {
            color: color
        };
    }

    // 尺寸
    static size(size) {
        size = this._transform(size);
        return {
            fontSize: size
        };
    }

    // 加粗
    static bold() {
       return {
           fontWeight: 'bold'
       };
    }

    // 对齐
    static align(align) {
        return {
            textAlign: align 
        }
    }

    // 欠缺超出字体隐藏

    /***************************************************************
     * Display相关系列
     **************************************************************/

    // flex
    static df() {
        return {
            display: 'flex'
        }
    }

    // none
    static dn() {
        return {
            display: 'none'
        };
    }

    /***************************************************************
     * Overflow相关系列
     **************************************************************/

    // 隐藏
    static oh() {
        return {
            overflow: 'hidden'
        };
    }

    // 显示
    static oa() {
        return {
            overflow: 'auto'
        };
    }

    // 滚动
    static os() {
        return {
            overflow: 'scroll'
        };
    }

    /***************************************************************
     * 对齐专用（由组件调用，最好不要直接在Page中调用）
     **************************************************************/

    // 主轴对齐
    static jf(align) {
        return {
            justifyContent: this._getAlign(align)
        };
    }

    // 副轴对齐
    static ai(align) {
        return {
            alignItems: this._getAlign(align)
        };
    }

    /***************************************************************
     * 功能函数系列
     **************************************************************/

    /**
     * 获取对齐方式
     * 
     * @param {String} align 对齐方式
     */
    static _getAlign(align) {
        switch(align) {
            case 'left':
            align = 'flex-start';
            break;
            case 'top':
            align = 'flex-start';
            break;
            case 'right':
            align = 'flex-end';
            break;
            case 'bottom':
            align = 'flex-end';
            break;
            case 'between':
            align = 'space-between';
            break;
            case 'around':
            align = 'space-around';
            break;
            default:
            align = 'center';
            break;
        }
        return align;
    }

    /**
     * 获取border对象的方法
     * 
     * @param {String} border border源值
     */
    static _getBorder(border) {
        
        // 声明变量
        let result = {};
        let temp = border.split(' ');

        // 遍历temp，赋值result
        for (let value of temp) {

            // 判断边框样式类型
            if (value == 'solid' || value == 'dashed' || value == 'dotted' || value == 'double') {
                result['style'] = value;
                continue;
            }

            // 判断是否为颜色
            if (value.indexOf('#') != -1 || value.indexOf('rgb') != -1) {
                result['color'] = value;
                continue;
            }

            // 判断宽度
            result['width'] = this._transform(value);
        }

        // 返回
        return result;
    }

    /**
     * 将rpx值转换为px值
     * 
     * @param {Int} size 需要转换的值
     */
    static _transform(size) {
        size = parseInt(size);
        if (size >= 750) {
            return screenWidth;
        }
        return Math.ceil(size * pxTransform);
    }
}
